<template>
  <el-container>
    <el-header style="height: 100%;border: 1px">
      <el-menu class="el-menu-demo" mode="horizontal" :router="true">
         <el-col :span="6" style="margin: 0px 43% 0px 10px ">
           <h2 style="font-size: 35px">:D豆嗲</h2>
         </el-col>
        <el-menu-item index="/homepage.html" style="padding: 40px 5px 62px 5px">首页</el-menu-item>
        <el-menu-item  style="padding: 40px 5px">/</el-menu-item>
        <el-menu-item index="/allGoods.html" style="padding: 40px 5px 62px 5px">全部商品</el-menu-item>
        <el-menu-item  style="padding: 40px 5px">/</el-menu-item>
        <el-menu-item index="/order.html" style="padding: 40px 5px 62px 5px">我的订单</el-menu-item>
        <el-menu-item  style="padding: 40px 5px">/</el-menu-item>
        <el-menu-item index="/star.html" style="padding: 40px 5px 62px 5px">我的收藏</el-menu-item>
        <el-menu-item  style="padding: 40px 5px">/</el-menu-item>
        <el-menu-item index="/shopping.html" style="padding: 40px 5px 62px 5px">购物车</el-menu-item>
        <el-menu-item  style="padding: 40px 5px">/</el-menu-item>
        <el-menu-item index="/login.html" style="padding: 40px 5px 62px 5px">登录</el-menu-item>
      </el-menu>
    </el-header>
    <el-main style="padding:20px 0px">
      <router-view />
    </el-main >
    <el-footer  style="padding:0px 0px 350px 0px">
      <el-row>
          <img width="35px" height="35px" style="margin: 50px 0px 0px -60%" src="../img/many.png">
        <h1 style="color: white;margin: -70px 42% 0px 0px ">品类齐全，轻松购物</h1>
        <el-col :span="2" style="margin: -50px 0px 0px 37% ">
          <img width="35px" height="35px" src="../img/fast.png">
        </el-col>
        <h1 style="color: white;margin: -60px 0% 0px 0px">多仓直发，极速配送</h1>
        <el-col :span="2" style="margin: -53px 0px 0px 200px ">
          <img width="33px" height="33px" src="../img/good.png">
        </el-col>
        <h1 style="color: white;margin: -60px 0px 0px 40%">正品好货，精致服务</h1>
      </el-row>
      <el-divider></el-divider>
        <img width="50px" height="50px" src="../img/touxiang.png">
      <el-breadcrumb>
        <el-breadcrumb-item style="font-size: 18px;margin-left: 30px">关于我们</el-breadcrumb-item>
        <el-breadcrumb-item style="font-size: 18px">联系我们</el-breadcrumb-item>
        <el-breadcrumb-item style="font-size: 18px">人才招聘</el-breadcrumb-item>
        <el-breadcrumb-item style="font-size: 18px">商家入驻</el-breadcrumb-item>
        <el-breadcrumb-item style="font-size: 18px">广告服务</el-breadcrumb-item>
        <el-breadcrumb-item style="font-size: 18px">手机京东</el-breadcrumb-item>
        <el-breadcrumb-item style="font-size: 18px">友情链接</el-breadcrumb-item>
        <el-breadcrumb-item style="font-size: 18px">销售联盟</el-breadcrumb-item>
      </el-breadcrumb>
      <h1 style="color: #8a8a8a;font-size: 15px;margin: 0px 20px 0px 0px">Copyright &copy; 2021 豆嗲:D.com版权所有</h1>
    </el-footer>
  </el-container>
</template>

<script>
export default {
  name: 'HomePage',
  created() {
    this.$store.dispatch('GET_USERINFO_ACTIONS');
  }

}
</script>

<style>
.el-header .el-menu {
  max-width: 1350px;
  margin: 0 auto;
}
.el-footer {
  background-color: #3d3d3d;
  text-align: center;
  line-height: 60px;
}
body > .el-container {
  margin-bottom: 40px;
}
.el-footer .el-menu.el-menu--horizontal {
  border-bottom: solid 0px #e6e6e6;
}

.el-footer .el-breadcrumb__inner {
  color: #8a8a8a;
}
.el-footer .el-breadcrumb {
  font-size: 14px;
  line-height: 1;
  margin-left: 25%;
}
.el-footer .el-breadcrumb__item:last-child .el-breadcrumb__inner, .el-breadcrumb__item:last-child .el-breadcrumb__inner a, .el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover, .el-breadcrumb__item:last-child .el-breadcrumb__inner:hover {
  font-weight: 400;
  color: #8a8a8a;
  cursor: text;
}
</style>
